<template>
    <div>
      <!-- {{}}插值表达式 在dom 写入 -->
      {{ age >= 18 ? "我是大人" : "我还是小孩" }}
      <div>
        <span>账号：</span>
        <input type="text" v-model="zhanghao" />
      </div>
      <div>
        <span>密码：</span>
        <input type="password" v-model="mima" />
      </div>
      <div>
        <span>下拉菜单：</span>
        <select v-model="from">
          <option value="吉林">吉林</option>
          <option value="杭州">杭州</option>
          <option value="北京">北京</option>
        </select>
      </div>
      <div>
        <!-- 复选框 -->
        <span>复选框：</span>
        <input type="checkbox" v-model="hobby" value="抽烟" />抽烟
        <input type="checkbox" v-model="hobby" value="喝酒" />喝酒
        <input type="checkbox" v-model="hobby" value="代码" />代码
      </div>
    </div>
  </template>
  
  <script>
  export default {
    data() {
      // 对象里面的key，当做变量使用
      return {
        zhanghao: "",
        mima: "",
        from: "",
        hobby: [],
        age: 18,
      };
    },
  };
  </script>
  
  <style>
  </style>